<!--
  ~ Copyright(c) 2016-2017 IBM, Red Hat, and others.
  ~
  ~ Licensed under the Apache License, Version 2.0 (the "License");
  ~ you may not use this file except in compliance with the License.
  ~ You may obtain a copy of the License at
  ~      http://www.apache.org/licenses/LICENSE-2.0
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  -->
<!DOCTYPE html>
<html lang="en">
<head>
    <base href="/">
    <title>Microprofile Conference</title>
    <link rel="icon" href="assets/images/favicon.png">

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta http-equiv="x-ua-compatible" content="ie=edge">

    <!-- Theme CSS -->
    <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="assets/css/node_modules/font-awesome/css/font-awesome.min.css" />
    <link rel="stylesheet" type="text/css" href="assets/css/node_modules/primeng/resources/primeng.min.css" />
    <link rel="stylesheet" type="text/css" href="assets/css/node_modules/primeng/resources/themes/afternoon/theme.css" />
    <link rel="stylesheet" type="text/css" href="assets/css/node_modules/fullcalendar/dist/fullcalendar.min.css" />

    <!-- 1. Load libraries -->
    <!-- Polyfill(s) for older browsers -->
    <script src="assets/js/node_modules/core-js/client/shim.min.js"></script>
    <script src="assets/js/node_modules/zone.js/dist/zone.js"></script>
    <script src="assets/js/node_modules/reflect-metadata/Reflect.js"></script>
    <script src="assets/js/node_modules/systemjs/dist/system.js"></script>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="assets/js/node_modules/html5shiv/dist/html5shiv.min.js"></script>
    <script src="assets/js/node_modules/respond.js/dest/respond.min.js"></script>
    <![endif]-->

    <!-- 2. Configure SystemJS -->
    <script src="assets/js/systemjs.config.js"></script>

    <script>
        System.import('app').catch(function (err) {
            console.error(err);
        });
    </script>

    <style type="text/css">
        html,
        body {
            height: 100%;
            /* The html and body elements cannot have any padding or margin. */
        }

        html {
            background-position: 0% 0%;
            background: url(assets/images/home_header.jpg) no-repeat center center fixed;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
        }

        #logo img{
            width: 200px;
            height: auto;
            position: absolute;
            top: 5px;
            left: 5px;
        }

        body{
            background-color: transparent;
        }

        /* Wrapper for page content to push down footer */
        #wrap {
            min-height: 100%;
            height: auto !important;
            height: 100%;
            /* Negative indent footer by it's height */
            margin: 0 auto -30px;
        }

        #push,
        #footer {
            height: 30px;
        }

        #footer {
            background-color: #f5f5f5;
        }
        .selected {
            background-color: #CFD8DC !important;
            color: white;
        }

        #wrap > div.container > conference > div > div.row.p-a-1.flex-items-xs-center > nav > a:active{
            color: white;
        }

        #wrap > div.container > conference > div > div.row.p-a-1.flex-items-xs-center > nav > a:hover{
            color: antiquewhite;
        }

        #wrap > div.container > conference > div > div.row.p-a-1.flex-items-xs-center > nav > a{
            color: whitesmoke;
        }

        .milky{
            background: white;
        }

        .text-muted {
            color: darkseagreen!important;
        }

        .img-circle {
            border-radius: 50%;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            box-shadow: 0 0 8px rgba(0, 0, 0, .8);
            -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
            -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
        }

        .row {
            padding-top: 10px;
        }

    </style>
</head>
<!-- 3. Display the application -->
<body>

<!--[if lt IE 9]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://outdatedbrowser.com/">upgrade
    your browser</a> for <strong>free</strong> to improve your experience.</p>
<![endif]-->

<div id="logo">
    <a target="_blank" href="http://microprofile.io/"><img src="assets/images/logo.png"/></a>
</div>

<div id="wrap">

    <div class="container">
        <conference>Loading...</conference>
    </div>

    <div id="push"></div>

</div>

<!-- Footer -->
<div id="footer" class="text-sm-right">
    <p>Copyright &copy Microprofile 2016</p>
</div>


<script src="assets/js/node_modules/jquery/dist/jquery.min.js"></script>
<script src="assets/js/node_modules/moment/moment.js"></script>
<script src="assets/js/node_modules/fullcalendar/dist/fullcalendar.min.js"></script>
<script src="assets/js/node_modules/tether/dist/js/tether.min.js"></script>
<script src="assets/js/node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="assets/js/node_modules/jquery-easing/dist/jquery.easing.1.3.umd.min.js"></script>
<script src="assets/js/node_modules/chart.js/dist/Chart.bundle.min.js"></script>

</body>

</html>
